<template>
  <view class="container">
    <div class="custom_card">
      <div class="header">
        <div class="header_left"></div>
        <div class="header_center">基本数据 <span>{{ hospitalId ? `（${hospitalName}）` : "" }}</span></div>
      </div>

      <!-- 收益内容区 -->
      <div class="shoui_content">
        <div class="shoui_content_item">
          <div class="shoui_content_item_title">设备总数</div>
          <div class="shoui_content_item_value">
            {{ curHospitalStatistics.deviceCount }}
          </div>
        </div>

        <div class="shoui_content_item2 shoui_content_item">
          <div class="shoui_content_item_title">订单总数</div>
          <div class="shoui_content_item_value">
            {{ curHospitalStatistics.orderCount }}
          </div>
        </div>

        <div class="shoui_content_item shoui_content_item3">
          <div class="shoui_content_item_title">累计收入</div>
          <div class="shoui_content_item_value">
            {{ (curHospitalStatistics.orderTotal * 1).toFixed(2) }}
          </div>
        </div>
      </div>
    </div>

    <div style="margin-top: 30rpx" class="custom_card">
      <div class="header">
        <div class="header_left2"></div>
        <div class="header_center">机构服务</div>
      </div>

      <view class="feature-buttons">
        <view class="feature-btn" @click="goToMyJiGou">
          <view class="feature-icon bluetooth-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/yiyuan.png" alt="" srcset="" />
          </view>
          <view class="feature-text">我的机构</view>
        </view>
        <view class="feature-btn" @click="goToMyYaunGong"  v-if="permission.includes('institution')">
          <view class="feature-icon guide-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/yuangong.png" alt="" srcset="" />
          </view>
          <view class="feature-text">员工管理</view>
        </view>
        <view class="feature-btn" @click="goToOrderStats"  v-if="permission.includes('institution')">
          <view class="feature-icon contact-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/feiyong.png" alt="" srcset="" />
          </view>
          <view class="feature-text">订单统计</view>
        </view>

        <view class="feature-btn" @click="goToComingSoon"  v-if="permission.includes('institution')">
          <view class="feature-icon contact-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/feiyong.png" alt="" srcset="" />
          </view>
          <view class="feature-text">被子统计</view>
        </view>

        <view class="feature-btn" @click="goToComingSoon"  v-if="permission.includes('institution')">
          <view class="feature-icon contact-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/feiyong.png" alt="" srcset="" />
          </view>
          <view class="feature-text">预约统计</view>
        </view>

        <view class="feature-btn" @click="goToComingSoon"  v-if="permission.includes('institution')">
          <view class="feature-icon contact-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/feiyong.png" alt="" srcset="" />
          </view>
          <view class="feature-text">医院护工</view>
        </view>
      </view>
    </div>

    <div style="margin-top: 30rpx" class="custom_card" v-if="permission.includes('order')">
      <div class="header">
        <div class="header_left2"></div>
        <div class="header_center">订单服务</div>
      </div>

      <view class="feature-buttons">
        <view class="feature-btn" @click="goToOrderStatus">
          <view class="feature-icon bluetooth-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/feiyong.png" />
          </view>
          <view class="feature-text">订单状态</view>
        </view>
        <view class="feature-btn" @click="goToRefund">
          <view class="feature-icon guide-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/tuikuan.png" />
          </view>
          <view class="feature-text">订单退款</view>
        </view>

        <view class="feature-btn" @click="goToComingSoon">
          <view class="feature-icon guide-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/common/beizi.png" />
          </view>
          <view class="feature-text">被子订单</view>
        </view>

        <view class="feature-btn" @click="goToComingSoon">
          <view class="feature-icon guide-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/common/yuyue.png" />
          </view>
          <view class="feature-text">预约订单</view>
        </view>
      </view>
    </div>

    <div style="margin-top: 30rpx" class="custom_card" v-if="permission.includes('equipment')">
      <div class="header">
        <div class="header_left2"></div>
        <div class="header_center">设备服务</div>
      </div>

      <view class="feature-buttons">
        <!-- <view class="feature-btn" @click="gotoDeviceStatus">
          <view class="feature-icon bluetooth-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/zhuantai.png" alt="" srcset="" />
          </view>
          <view class="feature-text">设备状态</view>
        </view> -->
        <view class="feature-btn" @click="gotoInService">
          <view class="feature-icon bluetooth-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/ruku.png" alt="" srcset="" />
          </view>
          <view class="feature-text">设备入库</view>
        </view>
        <view class="feature-btn" @click="gotoMaintain">
          <view class="feature-icon guide-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/weihu.png" alt="" srcset="" />
          </view>
          <view class="feature-text">设备维护</view>
        </view>
        <view class="feature-btn" @click="handleMoreService">
          <view class="feature-icon guide-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/fenbu.png" alt="" srcset="" />
          </view>
          <view class="feature-text">设备分布</view>
        </view>
      </view>
    </div>

    <div style="margin-top: 30rpx" class="custom_card" v-if="permission.includes('site')">
      <div class="header">
        <div class="header_left2"></div>
        <div class="header_center">驻场服务</div>
      </div>

      <view class="feature-buttons">
        <view class="feature-btn" @click="goToXunjian">
          <view class="feature-icon bluetooth-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/zhu1.png" alt="" srcset="" />
          </view>
          <view class="feature-text">巡检记录</view>
        </view>
        <view class="feature-btn" @click="goToDeviceTest">
          <view class="feature-icon bluetooth-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/zhu2.png" alt="" srcset="" />
          </view>
          <view class="feature-text">设备巡检</view>
        </view>
        <view class="feature-btn" @click="goToLockCodeMatching">
          <view class="feature-icon guide-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/zhu3.png" alt="" srcset="" />
          </view>
          <view class="feature-text">锁码匹配</view>
        </view>
        <view class="feature-btn" @click="goToTemporaryUnlocking">
          <view class="feature-icon guide-icon">
            <img style="width: 60rpx; height: 60rpx" src="/static/new/zhu4.png" alt="" srcset="" />
          </view>
          <view class="feature-text">临时开锁</view>
        </view>
      </view>
    </div>
  </view>
</template>

<script>
import { getHospitalStatistics, isAdmin as getUserIsAdmin, getHospital } from "@/api/index";
export default {
  data() {
    return {
      content: "",
      // 当前医院统计信息
      curHospitalStatistics: {
        // 设备总数
        deviceCount: 0,
        // 订单总数
        orderCount: 0,
        // 累计收入
        orderTotal: 0,
      },
      hospitalId: "",
      hospitalName: "",

      // 权限模块
      permission: []
    };
  },

  /**
   * 生命周期函数--监听页面加载
   */
  async onShow(options) {

    // 先获取当前用户拥有权限访问的医院
    const _hospitals = await getHospital({
      page: 1,
      limit: 10
    });

    console.log('_hospitals', _hospitals);

    if (uni.getStorageSync("curHospital")) {
      this.hospitalId = uni.getStorageSync("curHospital");
    } else {
      this.hospitalId = _hospitals?.list[0]?.id;
      uni.setStorageSync("curHospital", _hospitals?.list[0]?.id);
    }
    if (uni.getStorageSync("curHospitalName")) {
      this.hospitalName = uni.getStorageSync("curHospitalName");
    } else {
      this.hospitalName = _hospitals?.list?.[0]?.name;
      uni.setStorageSync("curHospitalName", _hospitals?.list?.[0]?.name);
    }



 
    const _res = await getHospitalStatistics({
      hospital_id: uni.getStorageSync("curHospital"),
      starttime: 1,
      // 结束时间是当前时间戳
      endtime: Date.parse(new Date()) / 1000,
    });
    // 累计收入
    let orderTotal = 0;
    // 订单数
    let orderCount = 0;
    // 设备数
    let deviceCount = 0;
    _res.hospital.forEach((_r) => {
      orderTotal += (_r.order_money_total * 1);
      orderCount += (_r.order_total * 1);
      deviceCount += (_r.equipment_total * 1);
    });

    this.curHospitalStatistics.deviceCount = deviceCount;
    this.curHospitalStatistics.orderCount = orderCount;
    this.curHospitalStatistics.orderTotal = orderTotal;


    // uni.setStorageSync("curHospital", _res?.[0]?.id);


    const userResult = await getUserIsAdmin();
    this.permission = userResult.modules;
  },

  methods: {
    // 敬请期待弹窗
    goToComingSoon() {
      uni.showToast({
        title: "敬请期待",
        icon: "none",
      });
    },
    /**
     * 返回上一页
     */
    goBack() {
      uni.navigateBack({
        delta: 1,
      });
    },
    // 去我的机构
    goToMyJiGou() {
      uni.navigateTo({
        url: "/pages/adminPage/jigou/index",
      });
    },
    // 去订单统计页面
    goToOrderStats() {
       // 如果没有选择机构，不能跳转
       if (!uni.getStorageSync("curHospital")) {
        return uni.showToast({
          title: "请先选择机构",
          icon: "none",
        });
      }
      uni.navigateTo({
        url: "/pages/adminPage/orderStats/index",
      });
    },
    // 去员工页面
    goToMyYaunGong() {
      // 如果没有选择机构，不能跳转
      if (!uni.getStorageSync("curHospital")) {
        return uni.showToast({
          title: "请先选择机构",
          icon: "none",
        });
      }
      uni.navigateTo({
        url: "/pages/adminPage/yuangong/index",
      });
    },
    // 订单状态页
    goToOrderStatus() {
      if (!uni.getStorageSync("curHospital")) {
        return uni.showToast({
          title: "请先选择机构",
          icon: "none",
        });
      }
      uni.navigateTo({
        url: "/pages/adminPage/orderStatus/index",
      });
    },
    // 退款订单也
    goToRefund() {
      if (!uni.getStorageSync("curHospital")) {
        return uni.showToast({
          title: "请先选择机构",
          icon: "none",
        });
      }
      uni.navigateTo({
        url: "/pages/adminPage/refund/index",
      });
    },
    // 入库
    gotoInService() {
      uni.navigateTo({
        url: "/pages/adminPage/deviceService/inStorage",
      });
    },
    // 设备维护
    gotoMaintain() {
      uni.navigateTo({
        url: "/pages/adminPage/deviceService/maintenance",
      });
    },
    handleMoreService() {
      uni.navigateTo({
        url: "/pages/adminPage/deviceService/distribution",
      });
    },
    // 设备状态二
    gotoDeviceStatus() {
      uni.navigateTo({
        url: "/pages/adminPage/deviceService/deviceStatus",
      });
    },
    // 巡检记录
    goToXunjian() {
      uni.navigateTo({
        url: "/pages/adminPage/siteService/siteInspection",
      });
    },
    // 临时开锁
    goToTemporaryUnlocking() {
      // 如果没有选择机构，不能跳转
      if (!uni.getStorageSync("curHospital")) {
        return uni.showToast({
          title: "请先选择机构",
          icon: "none",
        });
      }
      uni.navigateTo({
        url: "/pages/adminPage/siteService/temporaryUnlocking",
      });
    },
    goToDeviceTest() {
      uni.navigateTo({
        url: "/pages/adminPage/siteService/devivceTest",
      });
    },
    // 锁码匹配
    goToLockCodeMatching() {
      uni.navigateTo({
        url: "/pages/adminPage/siteService/lockCodeMatching",
      });
    },
  },

  /**
   * 分享当前页面
   */
  onShareAppMessage() {
    return {
      title: "关于我们",
      path: "/pages/newabout/index",
    };
  },
};
</script>

<style lang="scss" scoped>
.container {
  min-height: 100vh;
  background: #f8f9fa;
  padding: 20rpx;
}

.custom_card {
  line-height: 20rpx;
  border-radius: 10rpx;
  background-color: rgba(255, 255, 255, 1);
  color: rgba(16, 16, 16, 1);
  text-align: center;
  box-shadow: 0rpx 2rpx 6rpx 0rpx rgba(0, 0, 0, 0.4);
  font-family: PingFangSC-regular;
  width: 100%;

  padding: 28rpx;
}

.header {
  display: flex;
  align-items: center;
}

.header_left {
  width: 12rpx;
  height: 48rpx;
  border-radius: 20rpx;
  background-color: rgba(34, 209, 19, 1);
}

.header_left2 {
  width: 12rpx;
  height: 48rpx;
  border-radius: 20rpx;
  background-color: #138dd1;
}

.header_center {
  margin-left: 12rpx;
}

.shoui_content {
  margin-top: 20rpx;

  display: flex;
  justify-content: space-between;
}

.shoui_content_item {
  color: rgb(255, 255, 255);

  width: 30%;

  font-size: 28rpx;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  background: linear-gradient(90.96deg,
      rgba(157, 207, 255, 1) 0.6%,
      rgba(97, 172, 255, 1) 98.56%);

  padding-top: 30rpx;
  padding-bottom: 30rpx;
  border-radius: 20rpx;
}

.shoui_content_item2 {
  background: linear-gradient(90.96deg,
      rgba(255, 188, 109, 1) 0.6%,
      rgba(255, 91, 21, 1) 98.56%);
}

.shoui_content_item3 {
  background: linear-gradient(90.96deg,
      rgba(135, 229, 127, 1) 0.6%,
      rgba(0, 200, 20, 1) 98.56%);
}

.shoui_content_item_value {
  margin-top: 20rpx;
}

.feature-buttons {
  display: flex;
  justify-content: baseline;
  // justify-content: space-around;
  flex-wrap: wrap;

  .feature-btn {

    width: 33%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20rpx;

    .feature-icon {
      width: 96rpx;
      height: 96rpx;
      //   background: rgba(116, 185, 255, 0.1);
      border-radius: 24rpx;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 16rpx;
      //   box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.05);
    }

    .feature-text {
      font-size: 24rpx;
      color: #666666;
      text-align: center;
    }
  }
}
</style>
